<!--
 * @Description:
 * @Autor: 刘诗文
 * @Date: 2020-12-01 20:22:02
 * @LastEditors: 刘诗文
 * @LastEditTime: 2020-12-30 14:14:06
-->
<template>
  <div>
    <FormPanel ref="formPanel" :list="formList" :cols="3" :labelWidth="130" :formType="type" :isSubmitBtn="false" />
    <FilterTable
      ref="table"
      height="400"
      selectionType="single"
      :columns="columns"
      :datakey="'rows'"
      columnsRef="saleRemindInputslsw"
      :onColumnsChange="columns => (this.columns = columns)"
      :onRowSelectChange="onRowSelectChange"
    >
    </FilterTable>
    <FormPanel ref="formPanel_trackingRecord" :list="formListTrackingRecord" :cols="4" :labelWidth="130" :formType="type" :isSubmitBtn="false" />
    <FilterTable
      ref="table_trackingRecord"
      height="200"
      selectionType="single"
      :columns="columnsTrackingRecord"
      :datakey="'rows'"
      :dataSource="tableList"
      columnsRef="saleRemindInputsTrackingRecordlsw"
      :onColumnsChange="columnsTrackingRecord => (this.columnsTrackingRecord = columnsTrackingRecord)"
      :onRowSelectChange="onRowSelectChangeTrackingRecord"
      :onSyncTableData="tableHandle"
    >
      <template slot="controls">
        <el-button size="small" type="primary" icon="el-icon-plus" :disabled="trackingRecordButton" @click="addTrackingRecord">新增</el-button>
      </template>
    </FilterTable>
    <ButtonArea :containerStyle="{ display: 'flex', justifyContent: 'center' }">
      <AjaxButton type="primary" :click="saveHandle">确 定</AjaxButton>
      <el-button type="primary" @click="cancelHandle">取 消</el-button>
    </ButtonArea>
  </div>
</template>
<script>
import { dictionary } from '@/utils/dictMixin';
import { saveVisitInfo, getAllUser } from '@/api/customerRepair/saleReturnVisit/resultEntry';
import { returnHistory } from '@/api/customerRepair/afterSaleVisit/resultEntry';
import { isFormEmpty, notifyAction, camelCaseObject, findTableItem } from '@/utils';

export default {
  name: 'saleRemindInputs',
  mixins: [dictionary],
  props: {
    type: {
      type: String
    },
    formData: {
      type: Object,
      default: () => ({})
    }
  },
  data() {
    this.selectedData = null;
    this.BaseTable = null;
    this.selectedDataTrackingRecord = null;
    return {
      formList: this.createFromList(),
      columns: this.createTableColumns(),
      formListTrackingRecord: this.createFromListTrackingRecord(),
      columnsTrackingRecord: this.createTableColumnsTrackingRecord(),
      tableParamData: {},
      tableList: [], // 跟踪记录table
      remindInputsButton: false, // 问卷录入按钮是否只读
      trackingRecordButton: false // 跟踪table新增按钮是否只读
    };
  },
  mounted() {
    this.BaseTable = this.$refs.table;
    this.BaseTableTrackingRecord = this.$refs.table_trackingRecord;
    if (this.formData.trackStatus != 80581001) {
      this.getTrackHistory();
    }
    if (this.type === 'show') {
      this.remindInputsButton = true;
      this.trackingRecordButton = true;
    }
  },
  methods: {
    createFromList() {
      return [
        {
          type: 'INPUT',
          label: '客户编号',
          fieldName: 'ownerNo',
          disabled: true,
          initialValue: this.formData.ownerNo
        },
        {
          type: 'INPUT',
          label: '客户姓名',
          fieldName: 'ownerName',
          disabled: true,
          initialValue: this.formData.ownerName
        },
        {
          type: 'INPUT',
          label: '客户电话',
          fieldName: 'phone',
          disabled: true,
          initialValue: this.formData.phone
        },
        {
          type: 'INPUT',
          label: '客户手机',
          fieldName: 'mobile',
          disabled: true,
          initialValue: this.formData.mobile
        },
        {
          type: 'INPUT',
          label: '品牌',
          fieldName: 'brandName',
          disabled: true,
          initialValue: this.formData.brandName
        },
        {
          type: 'INPUT',
          label: '车系',
          fieldName: 'seriesName',
          disabled: true,
          initialValue: this.formData.seriesName
        },
        {
          type: 'INPUT',
          label: '车型',
          fieldName: 'modelName',
          disabled: true,
          initialValue: this.formData.modelName
        },
        {
          type: 'INPUT',
          label: 'VIN',
          fieldName: 'vin',
          disabled: true,
          initialValue: this.formData.vin
        },
        {
          type: 'INPUT',
          label: '地址',
          fieldName: 'address',
          disabled: true,
          initialValue: this.formData.address
        },
        {
          type: 'INPUT',
          label: '销售顾问',
          fieldName: 'salesConsultant',
          disabled: true,
          initialValue: this.formData.salesConsultant
        },
        {
          type: 'INPUT',
          label: '开票日期',
          fieldName: 'invoiceDate',
          disabled: true,
          initialValue: this.formData.invoiceDate
        },
        {
          type: 'INPUT',
          label: '出库日期',
          fieldName: 'hfrq1',
          disabled: true,
          initialValue: this.formData.hfrq1
        },
        {
          type: 'SELECT',
          label: '选择回访问卷',
          fieldName: 'a13',
          itemList: [],
          change: val => {
            this.selectQuestionnaire(val);
          }
        }
      ];
    },
    createTableColumns() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 70,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '问卷',
          dataIndex: 'a1',
          width: 120,
          showOverFlowTip: true
        },
        {
          title: '问卷内容',
          dataIndex: 'a2',
          width: 300,
          showOverFlowTip: true
        },
        {
          title: '必填',
          dataIndex: 'a3',
          width: 70,
          showOverFlowTip: true
        },
        {
          title: '类型',
          dataIndex: 'a4',
          width: 120,
          showOverFlowTip: true
        },
        {
          title: '答案',
          dataIndex: 'a5',
          width: 500,
          showOverFlowTip: true
        },
        {
          title: '备注',
          dataIndex: 'a6',
          width: 120,
          showOverFlowTip: true
        }
      ];
    },
    createFromListTrackingRecord() {
      return [
        {
          type: 'BREAK_SPACE',
          label: '本单跟踪记录'
        },
        {
          type: 'SELECT',
          label: '跟踪状态',
          fieldName: 'trackStatus',
          itemList: this.createDictList(8058, [80581001]),
          disabled: this.type === 'show' ? true : false,
          rules: [{ required: true, message: '请输入跟踪状态', trigger: 'blur' }],
          change: val => {
            if (val === 80581003) {
              this.formListTrackingRecord.find(x => x.fieldName === 'returnVisitResults').disabled = false;
            } else {
              this.formListTrackingRecord.find(x => x.fieldName === 'returnVisitResults').disabled = true;
              this.formListTrackingRecord.find(x => x.fieldName === 'returnVisitResults').initialValue = '';
            }
            if (val === 80581004) {
              this.formListTrackingRecord.find(x => x.fieldName === 'reasonsFailOfVisit').disabled = false;
            } else {
              this.formListTrackingRecord.find(x => x.fieldName === 'reasonsFailOfVisit').disabled = true;
              this.formListTrackingRecord.find(x => x.fieldName === 'reasonsFailOfVisit').initialValue = '';
            }
          }
        },
        {
          type: 'SELECT',
          label: '回访失败原因',
          fieldName: 'reasonsFailOfVisit',
          disabled: true,
          itemList: this.createDictList(1594)
        },
        {
          type: 'SELECT',
          label: '回访结果',
          fieldName: 'returnVisitResults',
          disabled: true,
          itemList: this.createDictList(8043, [80431002, 80431004])
        },
        // {
        //   type: 'SELECT',
        //   label: '不满意原因',
        //   fieldName: 'a4',
        //   itemList: []
        // },
        {
          type: 'TEXT_AREA',
          label: '备注',
          fieldName: 'remarks',
          selfCols: 2,
          initialValue: '',
          disabled: this.type === 'show' ? true : false
        },
        {
          type: 'TEXT_AREA',
          label: '不满意原因描述',
          fieldName: 'reasonsFailOfVisitInfo',
          selfCols: 2,
          initialValue: '',
          disabled: this.type === 'show' ? true : false
        }
      ];
    },
    createTableColumnsTrackingRecord() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 70,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '跟踪时间',
          dataIndex: 'trackDate',
          editType: 'date-picker',
          editable: true,
          dataFormat: 'yyyy-MM-dd HH:mm:ss',
          editRequired: true,
          showOverFlowTip: true
        },
        {
          title: '描述',
          dataIndex: 'describea',
          editType: 'text',
          editable: true,
          editRequired: true,
          showOverFlowTip: true
        }
      ];
    },
    onRowSelectChange(row) {
      if (!row.length) {
        this.selectedData = null;
      } else {
        this.selectedData = row[0];
      }
    },
    onRowSelectChangeTrackingRecord(row) {
      if (!row.length) {
        this.selectedDataTrackingRecord = null;
      } else {
        this.selectedDataTrackingRecord = row[0];
      }
    },
    // 选择问卷
    async selectQuestionnaire(val) {},
    //新增跟踪记录
    addTrackingRecord() {
      this.BaseTableTrackingRecord.EXECUTE_INSERT(this.tableParamData);
      this.trackingRecordButton = true;
    },
    // table动态回调函数
    tableHandle(val, isFirst) {
      this.tableList = val;
      if (isFirst && this.BaseTable) {
        for (let i = 0; i < val.length; i++) {
          this.BaseTable.SET_CELL_UNEDITABLE(val[i], 'trackDate', true);
          this.BaseTable.SET_CELL_UNEDITABLE(val[i], 'describea', true);
        }
      }
    },
    //确定
    async saveHandle() {
      const [err, data] = await this.$refs.formPanel_trackingRecord.GET_FORM_DATA();
      if (err) return;
      if (this.tableList.length > 0) {
        data.trackDate = this.tableList[this.tableList.length - 1].trackDate;
        data.describea = this.tableList[this.tableList.length - 1].describea;
        if (isFormEmpty(data.trackDate)) {
          return notifyAction('跟踪时间不能为空！', 'warning');
        }
        if (isFormEmpty(data.describea)) {
          return notifyAction('跟踪描述不能为空', 'warning');
        }
      } else {
        return notifyAction('请填写跟踪明细', 'warning');
      }
      data.returnVisitInfoId = this.formData.returnVisitInfoId;
      const res = await saveVisitInfo({ ...data });
      if (res.resultCode === 200) {
        if (res.errMsg) {
          notifyAction(res.errMsg, 'error');
        } else {
          notifyAction('保存成功！');
          this.cancelHandle();
        }
      }
    },
    //取消
    cancelHandle() {
      this.$emit('close', false);
    },
    // 查询跟踪记录信息
    async getTrackHistory() {
      const res = await returnHistory({ returnVisitInfoId: this.formData.returnVisitInfoId });
      if (res.resultCode === 200) {
        if (res.errMsg) {
          notifyAction(res.errMsg, 'error');
        } else {
          this.tableList = res.data;
        }
      }
    }
  }
};
</script>
<style lang="less" scoped></style>
